<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>文件信息-{{ file_info[2] }}</title>
</head>

<body>
  <h2>文件信息与下载</h2>
  <p>文件名称： <span id="file_name">{{ file_info[2] }}</span></p>
  <p>文件大小： <span id="file_size">{{ file_size }}</span></p>
  <p>文件上传时间： <span id="upload_time">{{ file_info[6] }}</span></p>
  <p>到期时间： <span id="expiration_time">{{ file_info[5] }}</span></p>
  <p>到期倒计时： <span id="count_down"></span></p>
  <button onclick="downloadFile()">下载文件</button>

  <script>
    function downloadFile() {
      // 发送请求获取下载链接
      fetch('/download_file/{{ file_info[1] }}')
     .then(response => response.text())
     .then(privateUrl => {
          // 创建一个不可见的 <iframe> 元素
          const iframe = document.createElement('iframe');
          iframe.style.display = 'none';
          iframe.src = privateUrl;

          // 将 <iframe> 元素添加到文档中
          document.body.appendChild(iframe);
      })
     .catch(error => {
          console.error('下载文件时出错:', error);
      });
    }

    // 获取到期时间的元素
    const expirationTimeElement = document.getElementById('expiration_time');
    // 获取倒计时显示的元素
    const countDownElement = document.getElementById('count_down');

    // 解析到期时间字符串为日期对象
    const expirationTime = new Date(expirationTimeElement.textContent);

    // 每隔 1 秒更新倒计时
    setInterval(() => {
      // 获取当前时间
      const now = new Date();

      // 计算剩余时间（以毫秒为单位）
      const remainingTime = expirationTime - now;

      // 如果剩余时间小于 0，显示已到期
      if (remainingTime < 0) {
        countDownElement.textContent = '已到期';
        return;
      }

      // 计算剩余的天、小时、分钟、秒
      const days = Math.floor(remainingTime / (1000 * 60 * 60 * 24));
      const hours = Math.floor((remainingTime % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      const minutes = Math.floor((remainingTime % (1000 * 60 * 60)) / (1000 * 60));
      const seconds = Math.floor((remainingTime % (1000 * 60)) / 1000);

      // 显示倒计时
      countDownElement.textContent = `${days} 天 ${hours} 小时 ${minutes} 分钟 ${seconds} 秒`;
    }, 1000);
  </script>
</body>

</html>